import {
	createVNode,
	render
}
from "vue"
import XtxMessage from './xtx-message.vue'

// 准备一个dom容器
const div = document.createElement('div')
div.setAttribute('class', 'xtx-message-container')
document.body.appendChild(div)

let timer = null

export default ({type, text}) => {
	const vnode = createVNode(XtxMessage, {type, text})
	
	// 把虚拟节点渲染DOM容器中
	render(vnode, div)
	clearTimeout(timer)
	
	// 3s后将dom容器的虚拟节点置空
	timer = setTimeout(() => {
		render(null, div)
	}, 3000)
}